<template>
  <section class="SelfPlayer">
    播放器
    <div class="fileBox" @drop="drop" @dragover="dragover">拖入文件</div>
  </section>
</template>

<script>
export default {
  name: 'SelfPlayer',
  methods: {
    dragover(e) {
      // console.log("dragover", e);
      e.stopPropagation()
      e.preventDefault()
    },
    drop(e) {
      console.log('drop', e);
      e.stopPropagation()
      e.preventDefault()
      let reader = new FileReader()
      reader.addEventListener('load',this.processFlv,false)
      reader.readAsArrayBuffer(e.dataTransfer.files[0])
    },
    processFlv(e) {
      let buffer = e.target.result
      let uint8 = new Uint8Array(buffer);
      console.log(uint8);
    }
  },
};
</script>

<style lang="scss" scoped>
.SelfPlayer{
  display: flex;
  justify-content: center;
}
.fileBox {
  width: 200px;
  height: 200px;
  background: red;
}
</style>